<!DOCTYPE html>
<html>
<include file="Public:header" />
<link href="__ACSS__/dialog.css" rel="stylesheet">
<link rel="stylesheet" href="__ACSS__/plugins/zTree/zTreeStyle.css" type="text/css">
<style>
.purchase-box span{ cursor:pointer; margin:10px 10px 5px 0; border:1px solid #ddd; padding:3px 13px; border-radius:4px; float:left; background:#fff; font-size:16px; position:relative;}
.purchase-box span:hover,.purchase-box span.on{ border:1px solid #777; background:#eee;}
.purchase-box span:active{ border:1px solid #666; background:#d1d1d1;}
.purchase-box span i{ display:none;}
.purchase-box span.on i{ display:block; position:absolute; bottom:0; right:1px; font-size:0.7em; color:#777;}
.purchase-box span b{ display:block; position:absolute; top:2px; right:4px; font-size:0.8em; color:red;}
.purchase-box{ background:#f7f7f9; border:1px solid #e1e1e8; border-radius:4px; margin:20px 0 20px 0; padding-top:10px; padding-bottom:15px;}
.wrapper{ padding-bottom:60px;}
</style>
<body>
    <div class="wrapper wrapper-content animated fadeInRight">
    	<div class="col-sm-12" style="padding:0px">
		    <input type="text" id="name" class="form-control" placeholder="请输入推荐人电话...">
		</div>
		<div class="col-sm-12 purchase-box">
			<h4 ref="<{$vo.code}>"><{$vo.name}></h4>
			<div class="row">
				<div class="col-sm-12" id="city-box">
					
				</div>
			</div>
		</div>
		<div class="clearfix"></div>
    </div>
    <div class="footer-bar">
    	<div class="clearfix">
    		<input type="hidden" class="purchase-list" value=""/>
			<button type="button" id="submit-btn" class="btn btn-success btn-block">提交</button>
		</div>
    </div>
</body>
<!-- 全局js -->
<include file="Public:foot" />
<script type="text/javascript">
$(function(){
	ifCheck();
})
function chooseCity(t){
	$("#city-box").find(".purchase-item").removeClass("on");
	$(t).addClass("on");
	ifCheck();
}
function ifCheck(){
	var num = 0;
	var str = "";
	$(".purchase-box").find(".purchase-item").each(function(index){
		if($(this).hasClass("on")){
			num += 1;
			if(str != ""){
				str += "|";
			}
			str += $(this).attr("ref")+"_"+$("#type-code").find("option:selected").text()+$(this).find("font").html();
		}
	})
	if(num == 0){
		$("#submit-btn").attr("disabled",true);
	}else{
		$("#submit-btn").attr("disabled",false);
	}
	$(".purchase-list").val(str);
}
$("#submit-btn").click(function(){
	var index = parent.layer.getFrameIndex(window.name);
	parent.getParentId($(".purchase-list").val());
	parent.layer.close(index);
})
$("#name").bind('input propertychange', function() {
	getReferrer($(this).val());
}); 
function getReferrer(param){
	var index = layer.load({shade:0});
	$.ajax({
		url:"__URL__/getReferrer",
		type:"post",
		data:{'param':param},
		success:function(json){
			var data = eval("("+json+")");
			var html = '';
			if(data.data != null){
				for(var i=0;i<data.data.length;i++){
					html += '<span onclick="chooseCity(this)" class="purchase-item" ref="'+ data.data[i].id +'"><font>'+ data.data[i].username +'</font>&nbsp;&nbsp;&nbsp;<font>电话:'+ data.data[i].tel +'</font><i class="fa fa-check"></i></span>';
				}
			}
			$("#city-box").html(html);
			layer.close(index);
		}
	})
}
</script>
</html>